﻿<template>
  <!-- 根据授权状态显示不同组件 -->
  <Auth v-if="!isAuthorized" type="KUAISHOU" @bind="handleBind" @apply="handleApply" />
  <List v-else type="KUAISHOU" @refresh-auth-status="checkAuthStatus" @go-to-auth="handleGoToAuth" />
</template>

<script setup>
  import Auth from "./components/Auth.vue";
  import List from "./components/List.vue";

  // 授权状态
  const isAuthorized = ref(false);

  // 检查授权状态
  const checkAuthStatus = async () => {
    try {
      // TODO: 调用接口检查授权状态
      // const res = await Api.channel.CheckAuthStatus({ type: 'KUAISHOU' });
      // isAuthorized.value = res.data.isAuthorized;

      // 暂时模拟数据
      isAuthorized.value = false; // 设为 false 显示授权页面，true 显示列表页面
    } catch (error) {
      console.error("检查授权状态失败:", error);
      isAuthorized.value = false;
    }
  };

  // 处理绑定事件
  const handleBind = async () => {
    try {
      console.log("开始绑定快手小程序");
      // TODO: 调用绑定接口
      // await Api.channel.BindKuaiShou();
      // 绑定成功后重新检查授权状态
      await checkAuthStatus();
    } catch (error) {
      console.error("绑定失败:", error);
    }
  };

  // 处理申请事件
  const handleApply = () => {
    console.log("跳转到快手开放平台申请小程序");
    // TODO: 跳转到快手开放平台
    // window.open('https://mp.kuaishou.com/', '_blank');
  };

  // 处理跳转到授权页面事件
  const handleGoToAuth = () => {
    isAuthorized.value = false;
  };

  // 页面加载时检查授权状态
  onMounted(() => {
    checkAuthStatus();
  });
</script>
